<!--#2-->
<template>
  <div class="mui-row">
    <div class="mui-col-md-6" id="tblDiv">
      <FoxTable  :initConfig="tbl"></FoxTable>
    </div>
    <div class="mui-col-md-6" id="formDiv">
      <ul>
        <li v-for="(row,index) in tbl.rows" v-html="row['n']"></li>
      </ul>

    </div>
  </div>
</template>
<script>
import FoxTable from "../components/Table.vue";

import tableConfig from "../components/tblConfig.js";

let bookConfig = {};
Object.assign(bookConfig,tableConfig,{
  getUrl:'/b/courses/get',
  // 获取详情
  getInfo:function(row,index){
    return row['n'] + " @"+index;
  },
  rowOps:[{
    title:"test",
    func:function(row,index){
      console.log("chk 00: index value=",index);

    }
  }],


  columns:[{
    title:"序号",
    // key: column name
    key:"i",
    

  },{
    title:"课程名",
    key:"n",

    // 单个元素的渲染
    render(r,i){
      //let s = r[1]; '<b>'+r[1]+'</b>'
      return `<b>${r['n']}</b>`;
    },
    sortable:true,
    direction:true
  },{
    title:"简介",
    key:"o",


  },{
    title:"tags",
    key:"t",


  }]
});

export default {
  data(){
    return {
      tbl:bookConfig
    }
  },
  methods:{
    test(){
      console.log(this.tbl.currentRow);
      this.tbl.rows.splice(this.tbl.currentSeq,1,
        Object.assign({},this.tbl.currentRow));
      console.log(this.tbl.getSelectedRows());
      this.tbl.rows[this.tbl.currentSeq] = this.tbl.currentRow;
    }

  },

  components:{FoxTable},
  props:[],
  computed:{}
}
</script>

<style lang="css">
</style>
